<template>
  <div>
    <div v-bind="$attrs" v-on="$listeners">这是儿子</div>
    <div>{{ son }}</div>
    <grandson v-bind="$attrs"  v-on="$listeners"></grandson>
    <slot></slot>
    <slot name="son" :data="msg"></slot>
  </div>
</template>
<script>
import grandson from "./grandson.vue";
export default {
  inheritAttrs: true,
  name: "son",
  components: { grandson },
  props: {
    son: {
      type: String,
      dedault: () => {},
    },
  },
  mounted() {
    this.$emit("son");
  },
  data() {
    return {
      msg: [
        { name: "zhangsan", age: "23" },
        { name: "zhangsan", age: "23" },
        { name: "zhangsan", age: "23" },
      ],
    };
  },
};
</script>
